import React from 'react';
import { Link } from 'react-router-dom/cjs/react-router-dom.min';
import placeholder from './assets/placeholder_240x240.png';

const PodcastCard = ({ id, title, coverUrl }) => {
    return (
        <div className="mt-3 col-lg-3 col-sm" >

            <Link className="text-decoration-none" to={`/podcasts/${id}`}>
                <div className="card">
                    <img src={coverUrl} onError={(e) => e.target.src = placeholder} className="card-img-top" alt="..." />
                    <div className="card-body">
                        <h5 className="card-title text-center">{title}</h5>
                    </div>
                </div>
            </Link>
        </div>
    );
};

export default PodcastCard;
